---
type: tutorial
title: Armazene seu repositório online
description: |-
  Tutorial: Construa seu primeiro blog Astro —
  Crie um repositório no GitHub para o projeto do tutorial
i18nReady: true
---
import Checklist from '~/components/Checklist.astro';
import Box from '~/components/tutorial/Box.astro';
import PreCheck from '~/components/tutorial/PreCheck.astro';
import { Steps } from '@astrojs/starlight/components';
import Badge from "~/components/Badge.astro"

<PreCheck>
  - Colocar o repositório do seu projeto online
</PreCheck>

Este tutorial irá utilizar GitHub para armazenar nosso repositório e conectar com uma hospedagem web. Você está livre para utilizar o provedor git online de sua escolha.

:::note
Se você já é familiar com git e tem seu próprio fluxo de trabalho, então crie um novo repositório no GitHub para o seu projeto utilizando seu método preferido. Pule para a próxima página: ["Faça deploy do seu site para a web"](/pt-br/tutorial/1-setup/5/).
:::

## Crie um repositório no GitHub

Apesar de terem algumas formas de conseguir armazenar o seu código local no GitHub, este tutorial irá te guiar através de um método que não precisa utilizar git na linha de comando. 

<Steps>
1. Entre no GitHub.com em um navegador e clique no <kbd>+</kbd> no lado superior direito da tela para criar um novo repositório. 

2. Escolha um nome para seu repositório. Não é necessário ser o mesmo nome que a pasta do seu projeto.

3. Você será apresentado opções, mas você não precisa mudar nenhuma das opções padrões. Role para baixo e clique no botão <kbd>Create Repository</kbd>.

4. Você será apresentado com vários próximos passos de configuração, mas você não precisará utilizar nenhum deles. Anote a URL do seu repositório. Você agora pode sair desta página sem fazer nada.
</Steps>

## Faça commit do seu código local para o GitHub

Na última seção, você fez uma mudança no conteúdo de uma página. Isso significa que os arquivos do seu projeto mudaram, e o VS Code deve mostrar um número acima do ícone do menu "Controle do Código-Fonte". Esta aba de código-fonte é onde você vai regularmente ir para atualizar seus arquivos no GitHub.

<Steps>
1. Clique na aba de Controle do Código no seu VS Code para ver uma lista de arquivos que foram modificados. Se você ver uma mensagem de que você precisa instalar `git`, siga as instruções fornecidas, e então recarregue o VS Code.

2. Clique no menu <kbd>•••</kbd> "3 pontos" acima da mensagem de commit e escolha <kbd>Remoto</kbd> > <kbd>Adicionar Remoto</kbd>.

3. Selecione <kbd>Adicionar remoto de GitHub</kbd>. Se necessário, siga quaisquer etapas de autenticação e então retorne para o VS Code e repita esta ação.

4. Você deve ver uma lista de todos os seus repositórios no GitHub. Escolha aquele que você criou para este projeto. Se você não vê o seu projeto, cole sua URL do GitHub diretamente. Você pode também ser questionado a dar a esse repositório um nome local. Selecione qualquer nome que desejar.

5. No topo do painel do menu, haverá um lugar para inserir uma **mensagem de commit** (descrição das suas mudanças em arquivos). Digite `commit inicial` e pressione o botão <kbd>Confirmação</kbd> para fazer commit dessas mudanças.

6. Você pode ver uma mensagem te dizendo que você não tem commits "preparados", e perguntando se você gostaria de prepará-los. Clique <kbd>Sempre</kbd> e continue.

7. Finalmente, a lista de arquivos modificados deve ser substituída com um botão de <kbd>Publicar</kbd>. Clique-o para enviar suas mudanças confirmadas ao GitHub.
</Steps>

### Veja seu projeto no GitHub

Para verificar que o seu projeto foi armazenado com sucesso no GitHub, visite GitHub.com e olhe em sua conta por uma lista de seus repositórios. Escolha o novo que você criou, e verifique que ele contém os arquivos do seu projeto Astro.




<Box icon="check-list">
## Checklist

<Checklist>
- [ ] Eu armazenei meu projeto no GitHub.
</Checklist>
</Box>

### Resources

- <p>[Utilizando Controle de Versão do Git no VS Code](https://code.visualstudio.com/docs/sourcecontrol/overview#_git-support) <Badge class="neutral-badge" text="externo" /></p>
